<%@ include file="include/common_jsp_header.jsp"%>
 <c:set var="currentSubSite" value="Alone at Home" />
<html>
<head>
    <%@ include file="include/html_head.jsp" %>
    <%@ include file="keytrends/keytrends_head.jsp" %>
    <%@ include file="overview/overview_head.jsp" %>

    <script language="javascript" type="text/javascript">
        $(document).ready(function() {
            $("#tabs").tabs();
            overview.style.visibility = "visible";
            $.get("${dataPath}/hist/neofonie.hist", displayHist);
            keytrends.style.visibility = "hidden";
            help.style.visibility = "hidden";

            $('#tabs').bind('tabsshow', function(event, ui) {
              overview.style.visibility = "hidden";
              keytrends.style.visibility = "hidden";
              help.style.visibility = "hidden";

              if (ui.index == 0) {
                overview.style.visibility = "visible";
                $.get("${dataPath}/hist/neofonie.hist", displayHist);
              } else if (ui.index == 1) {
                keytrends.style.visibility = "visible";
                $.get("${dataPath}/colloc/neofonie/top.data", displayTopColloc);
                $.get("${dataPath}/colloc/neofonie/bottom.data", displayBottomColloc);
                $.get("${dataPath}/colloc/neofonie/chart.data", displayChartColloc);
              } else if (ui.index == 2) {
                help.style.visibility = "visible";
              }
            });

            $("#selectedHist").change( function() {
                var query = $("#selectedHist option:selected").text();
                selectHist(query);
            });
            $("#selectedColloc").change( function() {
              var query = $("#selectedColloc option:selected").text();
              selectColloc(query);
          });

        });
    </script>
</head>
<body>

   <div id="site-wrapper" class="container">
      <%@ include file="include/page_header.jsp" %>

     <h2>DICODE dash board - twitter analysis</h2>
     <br/><br/>

     <div id="tabs">
        <ul>
          <li><a href="#overview"><span>Overview</a>
          <li><a href="#keytrends"><span>Key Trends</a>
          <li><a href="#help"><span>About</a>
        </ul>
     </div>
     <div id="overview" style="
                           height: 2000px;">
        <%@ include file="overview/overview_body.jsp" %>
      </div>
      <div id="keytrends" style="
                            height: 2000px;
                            position: relative;
                            top: -2002px;">
        <%@ include file="keytrends/keytrends_body.jsp" %>
      </div>
      <div id="help" style="
                      height: 2000px;
                      position: relative;
                      top: -4004px;">
        <%@ include file="help/help_body.jsp" %>
      </div>
    </div>
</body>
</html>
